@expo/config-plugins

What is @expo/config-plugins?

The @expo/config-plugins package allows developers to customize and configure their Expo and React Native projects using JavaScript or TypeScript. This package provides an API for modifying the native app configuration files (like AndroidManifest.xml or Info.plist) programmatically, without having to eject from the managed Expo workflow. It enables the integration of native code and settings directly into an Expo managed project, making it easier to add custom functionality and configurations.

What are @expo/config-plugins's main functionalities?

Modifying app.json / app.config.js

This feature allows developers to programmatically modify the app's configuration. In this example, the Android app is given camera permissions by modifying the AndroidManifest.xml through the app.json or app.config.js file.

const { withPlugins, AndroidConfig } = require('@expo/config-plugins');

module.exports = withPlugins(myExpoConfig, [
  [AndroidConfig.Permissions.withPermissions, ['CAMERA']],
]);

Creating custom plugins

Developers can create custom config plugins to encapsulate and reuse configuration logic across multiple projects. This example demonstrates how to create a simple plugin that modifies the project configuration.

const { createRunOncePlugin, withPlugins } = require('@expo/config-plugins');

const withCustomPlugin = (config) => {
  // Modify the config.
  return config;
};

module.exports = createRunOncePlugin(withCustomPlugin, 'packageName', '1.0.0');

Integrating with native code

This feature enables direct modification of native project files, allowing for deeper integrations and customizations. The example shows how to use a dangerous mod to modify Android native files directly.

const { withDangerousMod } = require('@expo/config-plugins');

module.exports = function withCustomNativeCode(config) {
  return withDangerousMod(config, [
    'android',
    async (config) => {
      // Modify native Android files directly.
      return config;
    },
  ]);
};

Other packages similar to @expo/config-plugins

react-native-config

Similar to @expo/config-plugins in that it allows for configuration of native app settings, react-native-config enables the management of environment variables for React Native apps. It differs in its approach by focusing on environment variables rather than direct modification of native app files.

patch-package

While not directly similar to @expo/config-plugins, patch-package allows developers to apply patches to their node modules, which can include modifications to native code or configurations. It provides a different approach to solving the problem of customizing and fixing issues in dependencies.

README

Expo Config Plugins

The Expo config is a powerful tool for generating native app code from a unified JavaScript interface. Most basic functionality can be controlled by using the the static Expo config, but some features require manipulation of the native project files. To support complex behavior we've created config plugins, and mods (short for modifiers).

For more info, please refer to the official docs: Config Plugins.